﻿@import url("Clear.css");
@import url("Comun.css");

/* ----------------------------------- */

body 
{
 background-image: url("../Images/musica.jpg");
 background-repeat: no-repeat;
 background-position: top center;
}

/* ----------------------------------- */

#library-main-container 
{
    height: 322px;
    /* background-color: rgb(209,223,236); */
    /* background: rgb(255,255,255); */
    background-color: transparent;
    margin-top: 3px;
}

/* ----------------------------------- */

#library-menu {
 float:left;
 width:125px;
 height: 322px;
}

/* ----------------------------------- */

#LibraryMain 
{
    width:510px;
    height: 322px;
    margin-left: 4px;
}

#LibraryMain  div.row.add.hover div.buttonAdd
{
    width:5%;
    visibility:visible;
    background: url('../Images/buttonAdd.gif') no-repeat center center;
}

#LibraryMain  div.row.add.hover.selected div.buttonAdd
{
    background: url('../Images/buttonAddSelected.gif') no-repeat center center;
}

#LibraryMain  div.row.edit.hover div.buttonEdit
{
    width:5%;
    visibility:visible;
    background: url('../Images/buttonEdit.gif') no-repeat center center;
}

#LibraryMain  div.row.playlist.hover div.mainColumn
{
    width:90%;
}

#LibraryMain  div.row.songsselected.hover div.mainColumn
{
    width:85%;
}

#LibraryMain div.row.playlist.hover div.buttonDelete, 
#LibraryMain div.row.playlist.hover div.buttonAdd,
#LibraryMain div.row.songsselected.hover div.buttonDelete,
#LibraryMain div.row.songsselected.hover div.buttonUp,
#LibraryMain div.row.songsselected.hover div.buttonDown
{
    width:4.9%;
    visibility:visible;
}

#LibraryMain  div.row.songsselected.hover div.buttonDelete
{
    background: url('../Images/buttonDelete.gif') no-repeat center center;
}

#LibraryMain  div.row.playlist.hover div.buttonDelete
{
    background: url('../Images/buttonDelete.gif') no-repeat center center;
}

#LibraryMain  div.row.playlist.hover div.buttonAdd
{
    background: url('../Images/buttonAdd.gif') no-repeat center center;
}

#LibraryMain  div.row.songsselected.hover.selected div.buttonDelete
{
    background: url('../Images/buttonDeleteSelected.gif') no-repeat center center;
}

#LibraryMain  div.row.songsselected.hover div.buttonUp
{
    background: url('../Images/buttonUp.gif') no-repeat center center;
}

#LibraryMain  div.row.songsselected.hover.selected div.buttonUp
{
    background: url('../Images/buttonUpSelected.gif') no-repeat center center;
}

#LibraryMain  div.row.songsselected.hover div.buttonDown
{
    background: url('../Images/buttonDown.gif') no-repeat center center;
}

#LibraryMain  div.row.songsselected.hover.selected div.buttonDown
{
    background: url('../Images/buttonDownSelected.gif') no-repeat center center;
}

#LibraryMain  div.row.addedit.hover.selected div.buttonAdd
{
    width:4.9%;
    visibility:visible;
    background: url('../Images/buttonAddSelected.gif') no-repeat center center;
}

#LibraryMain  div.row.addedit.hover div.buttonEdit
{
    width:4.9%;
    visibility:visible;
    background: url('../Images/buttonEdit.gif') no-repeat center center;
}

#LibraryMain  div.row.addedit.hover div.buttonAdd
{
    width:4.9%;
    visibility:visible;
    background: url('../Images/buttonAdd.gif') no-repeat center center;
}

#LibraryMain  div.row.addedit.hover div.mainColumn
{
    width:90%;
}


/* ----------------------------------- */

#library-footer-container 
{
    position:relative;
    height: 40px;
    margin-top: 5px;
    /* background:url('../Images/footer-bkgr.gif'); */
}

#library-footer-container a
{
    display:block;
    float:left;
}

#library-footer-container a.action-button 
{
    height:33px;
    font-size: 20px;
    font-weight:bold;
    color:#b5d5f7;
    border-right: 1px solid #2955aa;
    border-top: 1px solid #3b60ad;
    border-left: 1px solid #3b60ad;
    border-bottom: 1px solid #2053a1;
    background-color: #325ba9;
    padding-left:10px;
    padding-right:10px;
    padding-top:5px;
    float:right;
    margin-left:3px;
}

a#btnPrev, a#btnPlay, a#btnNext 
{
    margin-top:0px;
    display:block;
    float:left;
    height:40px;
    width:40px;
}

.btnPrev
{
    background:url('../Images/Previous.png') no-repeat;
}

.btnPrevDimmed 
{
    background:url('../Images/PreviousDimmed.png') no-repeat;
}

.btnPlay
{
    background:url('../Images/Play.png') no-repeat;
}

.btnPlayDimmed 
{
    background:url('../Images/PlayDimmed.png') no-repeat;
}

.btnPause
{
    background:url('../Images/Pause.png') no-repeat;
}

.btnNext
{
    background:url('../Images/Next.png') no-repeat;
}

.btnNextDimmed 
{
    background:url('../Images/NextDimmed.png') no-repeat;
}

/* ----------------------------------- */
#library-song-title
{
    position:relative;
    height: 40px;
}

#lblSongTitle 
{
    display:block;
    margin-top:3px;
    margin-left:0px;
    font-size:22px;
    width:640px;
    color:White;
    text-align:center;
}

/* ----------------------------------- */

#txtListName
{
 font-size:20px;
 border:1px solid #7A818A;
 width:99%;
}